<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>ES6中的类</title>
</head>
<body>
    <h4>类class</h4>
    <p>类抽象了对象的公共部分，它泛指一大类</p>
    <p>对象特指某一个，通过类实例化一个具体的对象</p>
    
    <script>
        var initFn = (function(){
            // 1、创建类class
            class Star{
                // 可以接受传递过来的参数，同时返回实例对象
                // constructor函数只要new实例化时，就会自动调用这个函数，如果不创建constructor函数，类会自动创建这个函数
                constructor(name){
                    this.uname = name
                }

                // 类里面所有的函数不需要function
                sing(song){
                    console.log(this.uname + '唱' + song);
                }
            }

            // 2、利用类创建对象（new 实例化）
            let star = new Star('刘德华')
            console.log(star);
            star.sing('冰雨');
        });
        
        var initFn1 = (function(){
            // 继承
            class Father{
                constructor(x, y){
                    this.x = x;
                    this.y = y;
                }

                sum(){
                    console.log(this.x + this.y);
                }

                say(){
                    console.log('我是爸爸');
                }
            }

            // extends可以实现继承
            class Son extends Father{
                constructor(x, y){
                    // 调用父类中的构造函数
                    super(x, y);
                }

                // super可以调用父类方法
                tet(){
                    console.log(super.say());
                }
            }

            let son = new Son(1, 2);
            son.sum();
            // super关键字调用父类普通函数
            // 如果子类存在与父类相同方法，则调用子类方法(就近原则)
            son.say();
        });

        var initFn2 = (function(){
            // 报错，在es6中没有变量提升，所以必须先定义类，才能通过类实例化对象
            // let son = new Son(5, 2); 

            class Father{
                constructor(x, y){
                    this.x = x;
                    this.y = y;
                }

                sum(){
                    // 类里面共有的属性和方法一定要加this使用
                    console.log(this.x + this.y);
                }
            }

            // 子类继承父类加法同时扩展减法方法
            class Son extends Father{
                constructor(x, y){
                    // 利用super调用父类的构造函数
                    // super必须在子类this之前调用
                    super(x, y);
                    this.x = x;
                    this.y = y;
                }


                subtract(){
                    console.log(this.x - this.y);
                }
            }

            let son = new Son(5, 2);
            son.sum();
            son.subtract();
        });


        initFn();
        initFn1();
        initFn2();
    </script>
</body>
</html>